<template>
  <input ref="uploadVideo" type="file" style="display: none" @change="sendVideoMessage" single accept="video/*" />
</template>

<script setup>
import { ref } from "vue";
import { MESSAGE_TYPE } from "@/IM/constant";
import saveMsg from "../../utils/saveMsg.js";
const emit = defineEmits(["onStartLoading", "onLoadending"]);
const uploadVideo = ref(null);
const openChooseVideo = () => {
  uploadVideo.value.click();
};
const sendVideoMessage = async () => {
  const videoFile = uploadVideo.value.files[0];
  if (!videoFile) return;
  const messageFileBody = {
    data: videoFile,
    filetype: videoFile.type,
    filename: videoFile.name
  };
  const options = {
    file: messageFileBody,
    onFileUploadError: () => {
      // 视频文件上传失败。
      console.log("onFileUploadError");
      emit("onLoadending");
    },
    onFileUploadProgress: e => {
      // 视频文件上传进度。
      console.log(e);
      emit("onStartLoading");
    },
    onFileUploadComplete: () => {
      // 视频文件上传成功。
      console.log("onFileUploadComplete");
      emit("onLoadending");
    }
  };
  saveMsg(options, MESSAGE_TYPE.VIDEO);
};
defineExpose({
  openChooseVideo
});
</script>

<style lang="scss" scoped></style>
